/*
 * @Date: 2020-08-27 09:11:10
 */
import React, { Component } from "react";
import Layout from "../comps/Layout";
import store from '../store'
export default class PageChild extends Component {
  componentDidMount() {
    store.subscribe(() => {
      this.forceUpdate()
    })
  }
  constructor(props) {
    super(props);
    this.state = {
      btn: "我是一个按钮",
      num: 0,
    };
  }
  changeNum = () => {
    this.setState(
      (state) => ({
        num: state.num + 1,
      }),
      () => {
        console.log('渲染完毕');
      }
    );
  };

  render() {
    console.log('store', store)
    const { btn, num } = this.state;
    return (
      <Layout showHeader={true} showFooter={false}>

        <div>
          <button onClick={this.changeNum}>{btn}</button>
          <span>
            我是一个普通的响应式{num}
          </span>
        </div>

        <div>
          <button onClick={() => { store.dispatch({ type: 'ADD' }) }}>{btn}</button>
          <span>我是redux中的数据 {store.getState()} </span>
        </div>
      </Layout>
    );
  }
}
